<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>地区管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  
    {include file="public/css"}
    {include file="public/js"}
</head>
<body>

<!-- 后台面包屑导航 -->
{:get_admin_breadcrumb()}
<br>
<blockquote class="layui-elem-quote">三级地区数据，新增或者修改了地区信息，必须重新更新地区信息，否则前台无法正确显示最新的地区数据
<br>如果发生数据父子关系错乱，可以点击【<a href="{:url('area/update')}" target="_blank">更新地区关系数据表</a>】，默认不需要操作。
</blockquote>
<!-- 搜索表单 -->
{:create_search_form("添加地区",$keywordsData,$customSingleField,$groupData,$dateData,$orderData)}
<div class="layui-form">
  <table class="layui-table" id="demo">
    <colgroup>
      <col width="50">
      <col width="50">
      <col width="110">
      <col width="110">
      <col width="110">
      <col width="30">
      <col width="110">
    </colgroup>
    <thead>

      <tr>
        <th><input type="checkbox"  id="selectAll"  lay-skin="primary" lay-filter="selectAll"></th>
        <th>地区ID</th>
        <th>地区名称</th>
        <th>上级ID</th>
        <th>下级数量</th>

        <th>直辖市</th>
        <th>操作</th>
      </tr> 
    </thead>
    <tbody>

{volist name='list' id='vo'}
      <tr data-id="{$vo.id}" data-pid="">
        <td><input type="checkbox" name="id[]" class="id " title=""  lay-skin="primary" value="{$vo.id}"></td>
        <td>{$vo.id}</td>
        <td><input type="text" name="name" class="layui-input name_{$vo.id}"  value="{$vo.name}"></td>
        <td><input type="text" name="pid"  class="layui-input pid_{$vo.id}" value="{$vo.pid}"></td>
        <td>
        {if $vo.level < 3}
        <a  href="{:url('area/index',array('pid'=>$vo['id']))}"  >查看下级 ( {$vo.total_child-1} ) </a>
        {else}--
        {/if}
        </td>
      
                <td>
      <input type="checkbox" name="switch" lay-skin="switch" lay-text="是|否" {if $vo.type ==1} checked {/if}> </td>
        <td>
        <div class="layui-btn-group">
        {if $vo.level < 3}
          <button class="layui-btn layui-btn-sm layui-btn-normal" 
          onclick="add('{:url("area/add",array("id"=>$vo["id"]))}','添加子地区','560px','45%')" title="添加子分类" > <i class="layui-icon">&#xe654;</i></button>   
        {/if}   
          <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="del('{:url("area/del",array("id"=>$vo["id"]))}')" > <i class="layui-icon">&#xe640;</i></button>
         </div>
 </td>
      </tr>
{/volist}

    </tbody>
  </table>
<!-- 搜索为空显示 -->
{if empty($list)}
 <div class="layui-form-item">
    <div class="empty">
     <div class="img"></div>
     <p>暂无内容</p></div>
 </div>
</div>
{/if}

</div>

<div id="pages">{$page|raw}</div>

<div class="layui-btn-group demoTable">

  <button class="layui-btn layui-btn-primary" id="del" data-type="getCheckData"> <i class="layui-icon">&#xe640;</i> 批量删除</button>
    <button class="layui-btn layui-btn-primary" id="updateArea" > <i class="layui-icon">&#xe640;</i> 更新地区</button>
</div>

<script>
$(function(){
 //全选批量删除
         var id = []; //定义空数组
        var url ="{:url('area/del')}"; //请求的url
        var data = {"id":id};   //传递的表单数据
        var delButton = "#del"; //删除节点class 或者ID
        var checkboxClass = ".id"; //多选框class
       

         $(delButton).click(function(){
              $(checkboxClass).each(function() {
              if(this.checked == true){
                   id.push($(this).val()); 
              }
              });              
         if(id.length == 0){
            parent.layer.alert('你没有选中任何分类',{title:'批量删除提示'});
         }else{
                     var index =parent.layer.confirm('批量删除后，数据不可恢复', {
                      btn: ['确定删除','取消'] //按钮
                      ,title:'是否批量删除'
                      ,shadeClose:true
                      ,icon: 3
                      ,anim: 5  //动画类型
                    }, function(){
                       parent.layer.close(index);
                    // 确定ajax 删除数据
                                $.post(url,data        
                                     ,function(json){
                                       if(json.code == 0){
                                          layer.msg(json.msg);
                                               setTimeout(function(){ 
                                                     window.location.reload();  //页面刷新
                                                },1000);
                                              }else{
                                           layer.msg(json.msg, {time: 5000, icon:5});
                                           }
                                         }
                               );

                    }, function(){
                       // 取消

                    });

         }

    });

   
$("#add").on("click",function(){
  add('{:url("area/add")}','添加地区','560px','45%');
});

// 即时更新表单数据
$("input").on("blur",function(){

var id =$(this).parents("tr").attr("data-id");
var name = $(".name_"+id).val();
var pid = $(".pid_"+id).val();
    $.post('{:url("area/edit")}',{"id":id,"pid":pid,"name":name},function(json){
      if(json.code == 0 || json.code == -1){
       layer.msg(json.msg);
      }
   
     }
  );
});
});
$("#updateArea").on("click",function(){
var index = parent.layer.confirm('由于地区数据比较大，更新过程比较忙，请耐心等待', {
  btn: ['确定','取消'], //按钮
  title:'地区信息更新提示'
}, function(){
	parent.layer.close(index);
	layer.msg('更新中', {
   icon: 16
  ,shade: 0.01
  ,time: 0
      });
	$.post('{:url("area/updateCache")}',{type:'1'},
                function(json){
	             				if(json.code ==0){
	             					 // parent.layer.close(index);
						             parent.layer.msg(json.msg);
						             return false  
						    	}
 
					    

		       });
}, function(){

});


});

</script>


</body>

</html>